@charset "utf-8";
.box1,box2,box3 {
	width: 500px;
	height: 500px;
	background-color: #EBF9AC;
}
.box1 div {
	width: 300px;
	height: 100px;
}

.box1 .item1 {
	background-color: #F0393C;
	width: 300px;
	height: 100px;
}
.box1 .item2 {
	background-color: #4BFF65;
	height: 100px;
	width: 300px;
}
.box1 .item3 {
	background-color: #3591FF;
	height: 100px;
	width: 300px;
}
.box2 {
	background-color: #B3E9AA;
	width: 500px;
	height: 500px;
}




.box2 .item1 {
	width: 300px;
	height: 100px;
	background-color: #FF4245;
	margin-left: auto;
	margin-right: auto;
}
.box2 .item2 {
	height: 100px;
	width: 300px;
	background-color: #69F879;
	margin-left: auto;
	margin-right: auto;
}
.box2 .item3 {
	width: 300px;
	height: 100px;
	background-color: #5BA5EB;
	margin-left: auto;
	margin-right: auto;
}

.box3 {
	width: 500px;
	height: 500px;
	background-color: #FFACAD;
}

.box3 .item1 {
	height: 101px;
	background-color: #DD2B2E;
	width: 33.333%;
	float: left;
}

.box3 .item2 {
	height: 101px;
	background-color: #59FFFC;
	width: 33.333%;
	margin-left: auto;
	margin-right: auto;
	float: left;
}

.box3 .item3 {
	height: 101px;
	background-color: #62DF97;
	width: 33.333%;
	margin-left: auto;
	margin-bottom: 0px;
	float: left;
}
.box4 {
	background-color: #D9FF9A;
	width: 500px;
	height: 400px;
}

.box4 div .item1 {
	background-color: #FF5454;
	height: 100px;
	float: left;
	width: 33.333%;
}
.box4 div .item2 {
	background-color: #31FF19;
	height: 100px;
	float: left;
	width: 33.333%;
}
.box4 div .item3 {
	background-color: #3F7FFF;
	height: 100px;
	float: left;
	width: 33.334%;
}

.box4 div {
	margin-left: auto;
	margin-right: auto;
	width: 400px;
}
.box5 {
}
.box5 div .item1 {
}
.box5 div .item2 {
}
.box5 div .item3 {
}
.box5 div {
}
